<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv=X-UA-Compatible content="IE=edge,chrome=1">
    <meta content=always name=referrer>
    <link rel="stylesheet" type="text/css" href="__STATIC__/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="__STATIC__/css/base_user.css">
    <link rel="stylesheet" type="text/css" href="__STATIC__/css-wap/style.css">
    <title>店铺</title>
</head>
{include file="public/href" /}
<body>
<div class="wrap-cre">
    <div class="header1">
        <img src="__STATIC__/img/back.png" class="back" onclick=window.location.href="{:url('mobile/user_category/shop_index')}?shop_id={:input('shop_id')}" >
        <div>
            <input onkeydown="search13()" type="search" id="search" placeholder="请输入搜索关键字" value="{:input('search','')}">
            <img src="__STATIC__/img_user/fl-sousuotubiao.png" onclick="search_title()">
        </div>
    </div>
    <div class="main">
        <div class="tablist">
            <ul>
                <li {eq name=":input('type',0)" value="0"}class="cur"{/eq}><div><a href="?shop_id={:input('shop_id')}&type=0&search={:input('search','')}&cate_id={:input('cate_id','')}"><span>综合</span></a></div></li>
                <li {eq name=":input('type')" value="1"}class="cur"{/eq}><div><a href="?shop_id={:input('shop_id')}&type=1&search={:input('search','')}&cate_id={:input('cate_id','')}"><span>销量</span></a></div></li>
                <li {eq name=":input('type')" value="2"}class="cur"{/eq}><div><a href="?shop_id={:input('shop_id')}&type=2&search={:input('search','')}&cate_id={:input('cate_id','')}"><span>新品</span></a></div></li>
                <li {if condition="input('type') eq 3 || input('type') eq 4" }class="cur"{/if}><div><a {eq name=":input('type')" value="3"} href="?shop_id={:input('shop_id')}&type=4&search={:input('search','')}&cate_id={:input('cate_id','')}" {else/} href="?shop_id={:input('shop_id')}&type=3&search={:input('search','')}&cate_id={:input('cate_id','')}" {/eq}><span>价格</span>
                <img {eq name=":input('type',0)" value="3"} src="__STATIC__/img_user/7.png" {else/}{eq name=":input('type',0)" value='4'}src="__STATIC__/img_user/fl-shangtubiao.png"{else/}src="__STATIC__/img_user/fl-shangxia.png"{/eq}{/eq}>
                </a>
            </div>
                </li>
            </ul>
            <input type="hidden" value="{:input('shop_id')}" id="shop_id" />
            <input type="hidden" value="{:input('type',0)}" id="type" />
            <input type="hidden" value="{:input('cate_id',0)}" id="cate_id" />
            <div class="down">
                <img src="__STATIC__/img_user/ss-paixu.png" id="sort_img" onclick="sort()">
            </div>
        </div>
    </div>
    <ul class="list_group" id="all_goods" style="margin-top: 1%;">

    </ul>
    <div class="style_123" style="display:none;">
</div>
</div>
{include file="public/src" /}
<script>
    //搜索
    function search_title(){
        var shop_id = $('#shop_id').val(),
                search = $('#search').val();
        window.location.href="{:url('user_category/shop_all_goods')}?shop_id="+shop_id+"&search="+search;
    }

    //页面排序
    function sort(){
        var status = $('#all_goods').css('display');
        if (status == 'none'){
            $('#all_goods').css('display','block');
            $('.style_123').css('display','none');
            $('#sort_img').prop('src','__STATIC__/img_user/ss-paixu.png');
        }else{
            $('#all_goods').css('display','none');
            $('.style_123').css('display','block');
            $('#sort_img').prop('src','__STATIC__/img_user/ss-paixu.png');
        }
    }

    //layer流加载
    layui.use('flow', function() {
        var $ = layui.jquery;
        //横向显示
        var flow = layui.flow;
        flow.load({
            elem: '#all_goods' //流加载容器
            ,isAuto:true
            ,isLazyimg:true
            ,done: function(page, next){ //执行下一页的回调
                var lis = [];
                var shop_id = $('#shop_id').val();
                var type = $('#type').val();
                var search = $('#search').val();
                var cate_id = $('#cate_id').val();
                $.ajax({
                    url:"all_goods",
                    dataType:'json',
                    type:'post',
                    data:{'page':page,'shop_id':shop_id,'type':type,'search':search,'cate_id':cate_id},
                    success:function(t){
                        layui.each(t.data, function(index, item){
                            lis.push('<li><a href="javascript:jump_goods('+item.id+');"><div class="pic"><img lay-src="/'+item.thumb_img+'" style="height: 150px;">' +
                                    '</div>' +
                                    '<h4 class="title">'+item.title+'</h4><div class="price">&yen;'+item.price+'<span class="sale_num">销量 '+item.sale_number+'</span></div>' +
                                    '</div></a></li>');
                        });
                        next(lis.join(''), page < t.pages);
                    },
                    error: function () {
                        layer.open({content:'网络繁忙,请重试',skin:'msg',time:2});
                    }
                })
            }
        });
        //竖向显示
        var flow_list = layui.flow;
        flow_list.load({
            elem: '.style_123' //流加载容器
            ,isAuto:false
            ,isLazyimg:true
            ,done: function(page, next){ //执行下一页的回调
                var lis = [];
                var shop_id = $('#shop_id').val();
                var search = $('#search').val();
                var type = $('#type').val();
                var cate_id = $('#cate_id').val();
                $.ajax({
                    url:"all_goods",
                    dataType:'json',
                    type:'post',
                    data:{'page':page,'search':search,'shop_id':shop_id,'type':type,'cate_id':cate_id},
                    success:function(t){
                        layui.each(t.data, function(index, item){
                            lis.push('<div class="content" style="height: 100px;"><div class="left" style="top:5px;"><img lay-src="/'+item.thumb_img+'"></div>' +
                                    '<div class="right" style="height: 80px;"><h4 onclick="jump_goods('+item.id+')">'+item.title+'</h4>' +
                                    '<div class="right"><h4 style="color: #E73F09;font-size: 14px;margin-top: 24px;height: 20px;">&yen;'+item.price+' <span style="float: right;font-size: 12px;color: #333;">销量'+item.sale_number+'</span></h4>' +
                                    '</div></div></div>');
                        });
                        next(lis.join(''), page < t.pages);
                    },
                    error: function () {
                        layer.open({content:'网络繁忙,请重试',skin:'msg',time:2});
                    }
                })
            }
        });
    });

    function search13() {
        var lKeyCode = (navigator.appname=="Netscape")?event.which:window.event.keyCode; //event.keyCode按的建的代码，13表示回车
        if (lKeyCode ==13){
            var shop_id = $('#shop_id').val(),
                    search = $('#search').val();
            document.activeElement.blur();
            window.location.href="{:url('user_category/shop_all_goods')}?shop_id="+shop_id+"&search="+search;
        }
    }

    //跳转到商品详情
    function jump_goods(id){
        var url = "{:url('mobile/user_category/goods_details')}?goods_id="+id;
        sessionStorage.setItem('goods_url_back',window.location.href);
        window.location.href = url;
    }
</script>
</body>
</html>